<template>
  <div>
    <van-share-sheet
      v-model:show="showShare"
      :options="options"
      title="立即分享给好友"
      class="sharepanel"
      @select="onSelect"
    ></van-share-sheet>
  </div>
</template>

<script>
import { ShareSheet } from "vant";
import { Toast } from "vant";
export default {
  props: ["showShare"],
  emits: ["update:showShare"],
  data() {
    return {
      options: [
        {
          name: "好友",
          icon: require("@/assets/images/share/haoyou.png"),
        },
        {
          name: "信息",
          icon: require("@/assets/images/share/xinxi.png"),
        },
        {
          name: "微信",
          icon: require("@/assets/images/share/weixin.png"),
        },
      ],
    };
  },
  components: {
    ShareSheet,
  },
  methods: {
    onSelect(val) {
      Toast(val.name);
      this.$emit("update:showShare", false);
    },
  },
  watch: {
    showShare() {
      this.$emit("update:showShare", this.showShare);
    },
  },
};
</script>

<style>
.sharepanel .van-share-sheet__options {
  padding-right: 0.08rem;
  justify-content: space-between;
}
</style>
